<template>
    <div style="border:1px solid #ffffff;padding:20px;margin-bottom:10px;background-color:#ffffff">
        <Steps :current="currentIndex" v-if="info.role_type == 4">
            <Step title="发起的投递" content="将编辑好的需求在金融平台上投递给您需要的服务机构，等待对方处理。"></Step>
            <Step title="收到的约谈" content="将您编辑好的需求在平台上发布，如果有服务机构与您约谈，可以选择接受或拒绝。"></Step>
            <Step title="正在约谈" content="接受约谈后，双方状态转换为正在约谈，双方可以进行线下约谈，可以同意合作，或者合作终止。"></Step>
            <Step title="正在合作" content="合作过程中，双方状态为正在合作，如果不满意可以合作终止。"></Step>
            <Step title="已完成" :status="completeStatus" content="合作完成后，双方可以点击合作结束，结束后向对方进行评分，双方状态为已结束。"></Step>
            <Step v-if="cancelVisiable" title="已取消" content="合作过程中，如果有一方点击合作终止，对接状态进入到已取消。"></Step>
        </Steps>
          <Steps :current="currentIndex" v-if="info.role_type == 5">
            <Step title="发起的约谈" content="将编辑好的服务在金融平台上投递给您需要的企业，等待对方处理。"></Step>
            <Step title="收到的投递" content="将您编辑好的服务在平台上发布，如果有企业与您约谈，可以选择接受或拒绝。"></Step>
            <Step title="正在约谈" content="接受约谈后，双方状态转换为正在约谈，双方可以进行线下约谈，可以同意合作，或者合作终止。"></Step>
            <Step title="正在合作" content="合作过程中，双方状态为正在合作，如果不满意可以合作终止。"></Step>
            <Step title="已完成" :status="completeStatus" content="合作完成后，双方可以点击合作结束，结束后向对方进行评分，双方状态为已结束。"></Step>
            <Step v-if="cancelVisiable" title="已取消" content="合作过程中，如果有一方点击合作终止，对接状态进入到已取消。"></Step>
        </Steps>     
    </div>
</template>
 <script>
    export default {
        name: 'abutmentprogress',
        props: {
            currentIndex: {
                type: Number
            }
        },
        computed: {
            info(){
                return this.$store.state.user.info;
            },
            completeStatus() {
                if(this.currentIndex == 4) return "finish";
                else if(this.currentIndex == 5) return "error";
                else return "process";
            },
            cancelVisiable() {
                return this.currentIndex == 5;
            }
        }
    }
</script>